#目录 + ul::-webkit-scrollbar {
  width: 0;
}

#目录 + ul {

  @apply sm:dark:brightness-125  sm:block sm:fixed sm:right-0 sm:top-0 sm:-z-10 sm:bottom-16;


  @media screen and (min-width: 640px) {
    width: calc(80vw - 48rem - 0.75rem);
    min-width: 300px;
    padding-left: 0em !important;
    overflow-y: auto;
    scroll-behavior: smooth;
  }
}

body:has(footer.active) #目录 + ul {
  max-height: calc(100vh - 5rem);
}

body:has(#目录 + ul) header.active #theme-btn {
  @apply static;
}
#btn-back-to-bottom,
#btn-back-to-top {
  @apply right-5;
}

body:has(#目录 + ul) #btn-back-to-bottom,
body:has(#目录 + ul) #btn-back-to-top {
  @apply sm:right-[350px];
  background-color: rgb(234 88 12);
}

#目录 + ul{
     @apply sm:top-[8rem]
}

body:has(header.active) #目录 + ul {
  @apply sm:top-[8rem];
  @media screen and (min-width: 640px) {
    max-height: calc(100vh - 7rem);
  }
}

#目录 + ul,
#目录 + ul ul {
  list-style-type: none;
}

#目录 + ul> *,#目录 + ul ul>*{
    margin-top:0.1em!important;
    margin-bottom:0.1em!important;
    font-size:0.8em;

}

body:has(.contentbox):has(#目录 + ul) {
  @apply mr-0;
  @media screen and (min-width: 640px) {
    margin-right: 300px;
    max-width: calc(100% - 80vw + 48rem + 0.75rem);
  }
}

body:has(.contentbox):has(#目录 + ul) .nav-container,
body:has(.contentbox):has(#目录 + ul) header {
  @media screen and (min-width: 640px) {
    max-width: calc(100vw - 0.75rem);
    width: calc(100vw - 0.75rem);
    z-index: 9999;
  }
}

body:has(.contentbox):has(#目录 + ul) footer {
  @media screen and (min-width: 640px) {
    max-width: 80vw;
    margin-left: calc(10vw - 1.5rem);
    width: 80vw;
  }
}

body:has(.contentbox):has(#目录 + ul) article {
  padding-bottom: 0rem;
}

 html[data-theme="dark"] #目录 + ul a.active{
  /* background-image: linear-gradient(to right, #555 0%, #111 100%); */
}

#目录 + ul a.active:hover{
    filter:none;
}

#目录 + ul a:not(.active) {
  @media screen and (min-width: 640px) {
    cursor: pointer;
  }
}

:root {
  scroll-behavior: smooth;
}
